<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<input type="button" id="b1" name="b1" value="测试"/>
<div id="id">


</div>

<script type="text/javascript">
    //异步刷新案例
    //a 创建XmlHttpRequest对象，固定写法
    document.getElementById("b1").onclick = function () {
        function createXmlHttpRequest(){
            var xmlHttp;
            try{    //Firefox, Opera 8.0+, Safari
                xmlHttp=new XMLHttpRequest();
            }catch (e){
                try{    //Internet Explorer
                    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
                }catch (e){
                    try{
                        xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
                    }catch (e){}
                }
            }
            return xmlHttp;
        }

        var xhr = createXmlHttpRequest();

        //b 注册状态变化的事件处理
        xhr.onreadystatechange = function(){

            if(xhr.readyState==4){
                //真正的处理
                if(xhr.status==200||xhr.status==304){
                    alert(xhr.status);
                    //服务器正确返回
                    var data = xhr.responseText;//服务器返回的数据
                    //把返回的数据吓到div中
                    document.getElementById("id").innerHTML=data;
                }
            }
        }

        //c 初始化xhr对象
        xhr.open("GET","/servlet/servlet?time="+new Date().getTime());

        //向服务器发送数据
        xhr.send(null);
    }

</script>
</body>
</html>